export default {
  name: 'routerView',
  functional: true, // 函数式组件，函数式组件的特点 性能高，不用创建实例 = react函数组件
  props: {  // 属性接收
    
  },
  render(h, {parent, data}) {
    // 获取当前要渲染的record
    let route = parent.$route

    // 第一层router-view 渲染第一个record 第二个router-view 渲染第二个

    let depth = 0;
    data.routerView = true

    while (parent) {  // router-view的父标签
      // $vnode 代表的是占位符vnode 组件的标签名的虚拟节点
      // _vnode 组件内部渲染的虚拟节点
      if (parent.$vnode && parent.$vnode.data.routerView) {
        depth++
      }
      parent = parent.$parent
    }

    let record = route.matched[depth] //获取对应层级的记录
    if (!record) {
      return h()
    }
    return h(record.component, data)
  }
}